<template>
	<view>
		<view style="display: flex;margin: 140rpx auto 100rpx auto;align-items: center;justify-content: center; ">
			<image style="display: flex;width: 65rpx;height: 65rpx;" src="../../static/quankelogo.png" mode=""></image>
			<text style="color: red;font-size: 45rpx;margin-left: 20rpx;">礼品兑换中心</text>
		</view>
		<view style="display: flex;align-items: center;justify-content: center;">
			<view style="color: red;">
				卡号：
			</view>
			<input
				style="display: flex;width:420rpx; padding: 15rpx 25rpx;font-size: 25rpx; border-radius: 9rpx;box-shadow: 1px 1px 5px #c2c2c2;"
				type="text" v-model="kahao" placeholder="请输入卡号" />
		</view>
		<view style="display: flex;align-items: center;margin-top:50rpx;justify-content: center;">
			<view style="color: red;">
				密码：
			</view>
			<input
				style="display: flex;width: 420rpx; padding: 15rpx 25rpx;font-size: 25rpx; border-radius: 9rpx;box-shadow: 1px 1px 5px #c2c2c2;"
				type="text" v-model="mima" placeholder="请输入密码" />
		</view>
		<view @click="duihuan"
			style="display: flex;width: 50%;height:75rpx;justify-content: center;align-items: center; margin: 150rpx auto 20rpx auto;background-color: orangered;border-radius: 15rpx;color: white;">
			立 即 兑 换
		</view>
		<view @click="kazhuangtai"
			style="display: flex;width: 50%;height:75rpx;justify-content: center;align-items: center; margin: 30rpx auto 20rpx auto;background-color: mediumblue;border-radius: 15rpx;color: white;">
			卡 状 态 查 询
		</view>
		<view @click="daili_login" style="margin: 35rpx 0 0 450rpx;color: darkgray;">
			经销商入口
		</view>
	</view>
</template>

<script>
	import getDateTime from '@/common/getdateTime.js';
	import model from '../../components/model.vue'
	export default {
		components: {
			model
		},
		data() {

			return {
				formatDate: '',
				kahao: '',
				mima: '',
			}
		},
		async onLoad() {
			// 时间戳转格式化字符串（本地时间）
			this.formatDate = (timestamp) => {
				const date = new Date(timestamp);
				const year = date.getFullYear();
				const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份+1补零
				const day = String(date.getDate()).padStart(2, '0');
				const hours = String(date.getHours()).padStart(2, '0');
				const minutes = String(date.getMinutes()).padStart(2, '0');
				const seconds = String(date.getSeconds()).padStart(2, '0');
				return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
			};
		},
		methods: {
			// 代理商登录
			daili_login() {
				uni.switchTab({
					url: '/pages/daili_login/daili_login'
				})
			},
			// 卡片状态查询
			kazhuangtai() {
				// 跳转到网页pages/address/address
				uni.navigateTo({
					url: '/pages/kazhuangtai/kazhuangtai'
				})
			},
			// 点击立即兑换
			duihuan() {
				if (!this.kahao || !this.mima) {
					return uni.showToast({
						title: "请输入卡号和密码后再试",
						icon: 'none'
					})
				}
				uni.showLoading({
					title: '加载中……'
				})
				uniCloud.callFunction({
					name: "fun1",
					data: {
						leixing: 1, //兑换
						kahao: this.kahao,
						mima: this.mima
					}
				}).then(res => {
					console.log(res);
					uni.hideLoading()
					if (res.result.data.length == 0) {
						return uni.showToast({
							title: "卡号密码错误，请联系经销商",
							icon: 'none'
						})
					}
					if (res.result.data[0].next_duihuantime > this.formatDate(new Date().getTime()) && res.result
						.data[0] !== "") {
						uni.showToast({
							title: "下次兑换时间为：" + res.result.data[0].next_duihuantime.slice(0, 10),
							icon: 'none'
						})
						return
					}
					// 跳转到网页pages/address/address
					uni.navigateTo({
						url: '/pages/address/detail?kahao=' + this.kahao + '&mima=' + this.mima
					})
				})
			},
		}
	}
</script>
<style>
	page {
		/* background-color: #F8F8F8; */
	}
</style>